"on click img "
Bootstrap 4.1.1 Snippet by Sagar Sonawane

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="imgBox"><img src="https://www.planwallpaper.com/static/images/963840d34c51efe6fbe57749fb434646.jpg"></div> <ul class="thumb"> <li><a href="https://www.planwallpaper.com/static/images/963840d34c51efe6fbe57749fb434646.jpg" target="imgBox"><img src="https://www.planwallpaper.com/static/images/963840d34c51efe6fbe57749fb434646.jpg" width="120px"></a></li> <li><a href="https://www.planwallpaper.com/static/images/3865967-wallpaper-full-hd_XNgM7er.jpg" target="imgBox"><img src="https://www.planwallpaper.com/static/images/3865967-wallpaper-full-hd_XNgM7er.jpg" width="120px"></a></li> <li><a href="https://www.planwallpaper.com/static/images/best-hd-quality-love-wallpaper.jpg" target="imgBox"><img src="https://www.planwallpaper.com/static/images/best-hd-quality-love-wallpaper.jpg" width="120px"></a></li> <li><a href="https://www.planwallpaper.com/static/images/Downlaod-Michael-Jackson-Wallpaper-HD.jpg" target="imgBox"><img src="https://www.planwallpaper.com/static/images/Downlaod-Michael-Jackson-Wallpaper-HD.jpg" width="120px"></a></li> <li><a href="https://www.planwallpaper.com/static/images/Summer-Wallpaper-Pictures.jpg" target="imgBox"><img src="https://www.planwallpaper.com/static/images/Summer-Wallpaper-Pictures.jpg" width="120px"></a></li> </ul>
body { margin: 0; padding: 0; } .imgBox { width: 720px; margin: 50px auto 20px; } .imgBox img { width: 100%; border: 4px solid #fff; box-shadow: 0 5px 25px rgba(0,0,0,.5); } ul.thumb { margin: 0 auto; padding:0; display: flex; align-item:center; justify-content:center; } ul.thumb li { list-style: none; margin: 0 10px; width:125px; height:100px; } ul.thumb li img { border: 4px solid #fff; box-shadow: 0 5px 25px rgba(0,0,0,.5); width:100%; height:100%; }
$(document).ready(function(){ $('.thumb a').click(function(e){ e.preventDefault(); $('.imgBox img').attr("src", $(this).attr("href")); }); });

Related: See More


Questions / Comments: